<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="en">
<head>
<jsp:include page="../common/adminContentHead.jsp" />
<title>课程设计管理系统</title>
</head>
<body>
	<!-- begin搜索 -->
	<div class="well well-sm" id="searchIntro">
		<form id="searchForm" class="form-inline">
			<div class="row">
				<div class="form-group  col-md-12">
					<div class="input-group">
						<span class="input-group-addon">题目</span>
						<input class="form-control" name="name">
					</div>
					
					<div class="input-group" style="margin-left: 20px;">
						<button type="button" class="btn btn-success" onclick="loadPaging(1)">搜索</button>
						<input type="reset" id="formRest" style="display: none;">
						<button type="button" class="btn btn-success" onclick="resetIntro(1)" style="margin-left: 5px;">重置</button>
					</div>
				</div>
			</div>
		</form>
	</div>
	<div class="row">
		<div class="col-md-12" id="userList">
			<div class="panel panel-default">
				<div class="panel-heading" style="padding: 5px 15px;">
					<button type="button" class="btn btn-success btm-sm" id="add_id" onclick="addTopic()">新增</button>
				</div>
				<div class="panel-body hfit" style="overflow-x: auto;">
					<input type="hidden" id="currentUserId">
					<!-- Table -->
				  	<table class="table table-bordered table-hover"  id="table_users_fqj">
					   <thead>
					      <tr>
					      	 <th style="width: 30px;"><input type="checkbox"></th>
					         <th field="name">题目 </th>
					         <th field="description">要求</th>
					         <th field="creatTime" >添加时间</th>
					         <th field="cz" render="btndos">操作</th>
					      </tr>
					   </thead>
					</table>
					<div id="table_Paging_fqj"></div>
				</div>
			</div>
		</div>
	</div>
	
	<div id="addArea" class="panel panel-default" style="padding: 10px 30px;border: none;display: none;">
		<form id="updataForm" class="form-horizontal">
			<div class="form-group col-md-14">
			  	<label>题目</label>
			  	<input type="text" id="name" name="name" class="form-control" placeholder="题目" value="${adminUser.loginName}">
			</div>
			<div class="form-group col-md-14">
			  	<label>截至日期</label>
			  	<input  name="finishDate" id="finishDate" type="text" class="form-control">
			</div>
			<div class="form-group col-md-14">
			  	<label>要求</label>
			  	<textarea id="description" name="description" class="form-control" rows="10" cols="80"></textarea>
			</div>
			<input type="hidden" id="id" name="id" >
		</form>
	</div>
	
	<div id=topicAcce class="panel panel-default" style="padding: 10px 30px;border: none;display: none;">
		<div class="form-group col-md-14">
		   <input id="fileContainer" type="file"  >  
		   <button id="upload" type="button" class="btn btn-default btn-sm" >上传</button>
		   <span class="processP"></span> 
		</div>
		<div class="form-group col-md-14" id="files">
		</div>
	</div>
 
	<script type="text/javascript" src="${pageContext.request.contextPath}/js/system/bootstrapTable.js?v=<%=getServletContext().getAttribute("version") %>"></script>
	<script type="text/javascript">
		/* 初始化 start */
		$(function() {
			var divheight = $(window).height();//初始化修改div的高度
			divheight = divheight - 125;
			$(".hfit").css({
				height : divheight
			});
			loadPaging(1);
		});
		/*加载用户*/
		function loadUsers(pageNum){
			var url=rootpath+"/topic/getlist.shtml";
			var offSet=(pageNum-1)*10;
			var searchData=$("#searchForm").getFormData();
			searchData.offSet=offSet;
			searchData.pageSize=10;
			$.post(url,searchData,function(rows){
				$("#table_users_fqj").table(rows);
				//初始化分页插件
			});
		}
		function loadPaging(pageNum){
			var url=rootpath+"/topic/getlist.shtml";
			var offSet=(pageNum-1)*10;
			var searchData=$("#searchForm").getFormData();
			searchData.offSet=offSet;
			searchData.pageSize=10;
			$.post(url,searchData,function(data){
				var rows=data.items;
				var count=data.rowsCount;
				$("#table_users_fqj").table(rows);
				//初始化分页插件
				$("#table_Paging_fqj").tablePaging(1,10,count,"loadUsers");
			});
		}
		/*重置*/
		function resetIntro(){
			$("#searchForm").reset();
			loadPaging(1);
		}
		 
		/*按钮渲染*/
		function btndos(e){
			var row=e.row;
			var btns = new Array();
			btns.push("<button type=\"button\" class=\"btn btn-default btn-sm\" onclick=\"deleteTopic("+row.id+")\">删除</button>");
			btns.push("<button type=\"button\" class=\"btn btn-default btn-sm\" onclick=\"editTopic("+row.id+")\">修改</button>");
			btns.push("<button type=\"button\" class=\"btn btn-default btn-sm\" onclick=\"topicAcce("+row.id+")\">附件</button>");
			return btns.join("&nbsp;&nbsp;");;
		}
 
		//新增
		function addTopic() {
			$('#id').val('');
			$('#name').val('');
			$('#description').val('');
			$('#finishDate').val('');
			save();
		}
		//编辑
		function editTopic(id) {
			var url = rootpath + "/topic/findById.shtml";
			$.post(url, {
				'id' : id
			}, function(data) {
				if (data.status) {
					var topic = data.data;
					topic = jQuery.parseJSON(topic)
					$('#id').val(topic.id);
					$('#name').val(topic.name);
					$('#description').val(topic.description);
					$('#finishDate').val(topic.finishDate);
					save();
				} else {
					layer.msg('编辑失败');
				}
			});
		}
		//删除
		function deleteTopic(id) {
			layer.confirm('确定删除吗？', { btn: ['确定', '取消'], title:''  }, function () {
				var url = rootpath + "/topic/delete.shtml";
				$.post(url, {
					'id' : id
				}, function(data) {
					if (data.status) {
						layer.msg('删除成功');
						layer.closeAll();
						loadPaging(1);
					} else {
						layer.msg('编辑失败');
					}
				});
        		layer.closeAll();   
            }, function () {
            	layer.closeAll();
            });
		}

		function save() {
			layer.open({
				type : 1,
				title : '添加',
				area : [ '580px', '500px' ],
				content : $('#addArea'),
				btn : [ '确定', '取消' ], //按钮
				yes : function(index, layero) {
					var url = rootpath + "/topic/save.shtml";
					var datas = {};
					datas.id = $('#id').val();
					datas.name = $('#name').val();
					datas.description = $('#description').val();
					var finishDate = $('#finishDate').val();
					if (finishDate) {
						datas.finishDate = finishDate.toString();
					}
					$.post(url, datas, function(data) {
						if (data) {
							layer.msg('保存成功');
							loadPaging(1);
							layer.closeAll();
						} else {
							layer.msg('保存失败');
						}
					});
				},
				btn2 : function(index, layero) {

				}
			});
		}
		var tid;
		function topicAcce(id) {
			tid = id;
			findAllTopicAcce(tid)
			layer.open({
				type : 1,
				title : '附件',
				area : [ '800px', '580px' ],
				content : $('#topicAcce')
			});
		}

		//删除
		function deleteTopicAcce(id) {
			var url = rootpath + "/topic/delAcce.shtml";
			$.post(url, {
				'taid' : id
			}, function(data) {
				if (data.status) {
					layer.msg('删除成功');
					findAllTopicAcce(tid)
				} else {
					layer.msg('编辑失败');
				}
			});
		}

		function findAllTopicAcce(tid) {
			var url = rootpath + "/topic/findAcce.shtml";
			$
					.post(
							url,
							{
								'tid' : tid
							},
							function(data) {
								if (data.status) {
									var data = JSON.parse(data.data);
									var files = new Array();
									$
											.each(
													data,
													function(i, obj) {
														var fileurl = rootpath
																+ "/" + obj.url;
														files
																.push('<span style="display: inherit;"><a href="'+fileurl+'">'
																		+ obj.name
																		+ '</a>  <button type="button" class="btn btn-default btn-sm" onclick="deleteTopicAcce('
																		+ obj.id
																		+ ')">删除</button></span>');
													})
									$('#files').html(files.join("&nbsp;"));
								} else {
									layer.msg('编辑失败');
								}
							});
		}

		$('#upload')
				.click(
						function() {
							if (!$("#fileContainer").val()) {
								layer.msg('请选择文件');
								return;
							}
							var xhr = new XMLHttpRequest();
							var fileObj = document
									.getElementById("fileContainer").files[0]; // 获取文件对象  
							var formdata = new FormData();
							formdata.append('file', fileObj);
							var pecent = 0, loop = null;
							xhr.open('post', rootpath + '/upload/file.shtml',
									true);
							xhr.onreadystatechange = function() {
								if (xhr.readyState == 4 && xhr.status == 200) {
									var data = JSON.parse(xhr.responseText);
									var fid = data.data;
									if (data.status) {
										$("#fileContainer").val("");
										$(".processP").hide();
										$(".result").html(data.info);
										$(".result").show();
										$.post(rootpath
												+ '/topic/addAcce.shtml', {
											'tid' : tid,
											'fid' : fid
										}, function(data) {
											$(".processP").html("关联成功！")
										});
										findAllTopicAcce(tid)
									} else {
										$(".processP").html("上传失败!")
									}
									$(".excel").val("")
								} else {
									$(".processP").html("上传出错！")
								}
							};
							xhr.upload.addEventListener('progress',
									uploadProgress, false);
							function uploadProgress(evt) {
								$(".result").hide();
								$(".processP").show();
								if (evt.lengthComputable) {
									var percentComplete = Math.round(evt.loaded
											* 100 / evt.total);
									$(".processP").html(
											percentComplete.toString() + '%')
									if (percentComplete.toString() == '100') {
										$(".processP").html("文件上传成功,数据解析中!")
									}
								} else {
									$(".processP").html("上传出错！")
								}
							}
							xhr.send(formdata);
						});
	</script>
	
</body>
</html>
